var compareFunc = (form, field) => {
  let oldVal = form.trackValue;
  if (oldVal) {
    let newVal = form.model;
    field.prop.split(".").forEach(p => {
      if (newVal) {
        newVal = newVal[p];
      }
    });
    field.prop.split(".").forEach(p => {
      if (oldVal) {
        oldVal = oldVal[p];
      }
    });

    if (typeof newVal === "object") {
      newVal = JSON.stringify(newVal);
    }
    if (typeof oldVal === "object") {
      oldVal = JSON.stringify(oldVal);
    }

    if (newVal !== oldVal && !(!newVal && !oldVal)) {
      if (field.$slots.default.length > 0 && field.$slots.default[0].componentInstance.$options._componentTag === "el-select") {
        oldVal = field.$slots.default[0].componentInstance.getOption(oldVal).label || oldVal;
        newVal = field.$slots.default[0].componentInstance.getOption(newVal).label || newVal;
      }
      if (field.$slots.default.length > 0 && field.$slots.default[0].componentInstance.$options._componentTag === "el-radio-group") {
        let radioGroup = field.$slots.default[0].componentInstance;
        radioGroup.$children.forEach(radio => {
          if(radio.$options._componentTag === "el-radio" || radio.$options._componentTag === "el-radio-button") {
            if(radio.label == oldVal){
              oldVal = radio.$el.innerText
            }
            if(radio.label == newVal){
              newVal = radio.$el.innerText
            }
          }
        });
      }
      if (!field.trackLabel) {
        field.trackLabel = document.createElement("div");
        field.trackLabel.className = "el-form-item__track el-form-item__error";
        if (!oldVal) {
          oldVal = "";
        }
        field.trackLabel.innerHTML = `原值：${oldVal}`;
        if (field.validateState === "error") {
          field.trackLabel.style = "display:none";
        }
        field.$el.querySelector(".el-form-item__content").appendChild(field.trackLabel);
        field.$el.classList.add("is-track");
      }
    } else if (field.trackLabel) {
      field.$el.querySelector(".el-form-item__content").removeChild(field.trackLabel);
      field.$el.classList.remove("is-track");
      field.trackLabel = null;
    }
    form.$emit("form-track", {
      prop: field.prop,
      label: field.label,
      oldValue: oldVal,
      newValue: newVal
    });
  } else if (field.trackLabel) {
    field.$el.querySelector(".el-form-item__content").removeChild(field.trackLabel);
    field.$el.classList.remove("is-track");
    field.trackLabel = null;
  }
};

export default {
  bind(el, binding, vnode) {
    vnode.componentInstance.trackValue = binding.value;

    vnode.componentInstance.$on("el.form.addField", field => {
      field.trackLabel = null;
      field.compareValue = () => compareFunc(vnode.componentInstance, field);
      field.compareValue();
      field.$on("el.form.change", field.compareValue);
    });

    vnode.componentInstance.trackValidate = (prop, valid) =>{
      let field = vnode.componentInstance.fields.find(f => {
        return f.prop == prop;
      });
      if(field && field.trackLabel) {
        vnode.componentInstance.$nextTick(()=>{
          if (valid) {
            field.trackLabel.style = "";
            field.$el.classList.add("is-track");
          } else {
            field.trackLabel.style = "display:none";
            field.$el.classList.remove("is-track");
          }
        })
      }
    };

    vnode.componentInstance.$on("validate", vnode.componentInstance.trackValidate);
  },
  update(el, binding, vnode) {
    if(vnode.componentInstance.trackValue != binding.value) {
      vnode.componentInstance.trackValue = binding.value;
      if(binding.value){
        vnode.componentInstance.fields.forEach(field => {
          field.compareValue();
          field.$on("el.form.change", field.compareValue);
        });
        vnode.componentInstance.$on("validate", vnode.componentInstance.trackValidate);
      }
      else {
        vnode.componentInstance.fields.forEach(field => {
          field.compareValue(null);
          field.$off("el.form.change", field.compareValue);
        });
        vnode.componentInstance.$off("validate", vnode.componentInstance.trackValidate);
      }
    }
  }
};
